<template>
    <div class="container">
        <div class="content">
            <div style="color: #de3f2f; margin-bottom: 10px;">*姓名输入 *，则查询全部人员的提交记录</div>
            <el-form :inline="true" :model="searchForm">
                <el-row :gutter="20">
                    <el-col :span="5">
                        <el-form-item label="姓 名">
                            <el-input
                                v-model="searchForm.username"
                                placeholder="默认为当前用户"
                                clearable
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="开始时时间">
                            <el-date-picker
                                v-model="searchForm.startTime"
                                type="datetime"
                                placeholder="开始时间"
                                value-format="YYYY-MM-DD HH:mm"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="结束时间">
                            <el-date-picker
                                v-model="searchForm.endTime"
                                type="datetime"
                                placeholder="默认为当前时间"
                                value-format="YYYY-MM-DD HH:mm"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="16">
                        <el-form-item label="指定文件目录" style="width: 100%;">
                            <el-input
                                v-model="searchForm.repoPath"
                                placeholder="定位到.git所在目录"
                                clearable
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="3">
                        <el-form-item>
                            <el-button type="primary" @click="onSubmit">获 取</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div class="info" v-if="resultValue.username">
                <el-descriptions
                    title="获 取 结 果"
                    direction="vertical"
                    border
                    style="margin-top: 20px"
                >
                    <el-descriptions-item label="姓 名">{{ resultValue.username }}</el-descriptions-item>
                    <el-descriptions-item>
                        <template #label>
                            <el-popover :width="700" trigger="hover">
                                <template #reference>
                                    <span>
                                        文件数量
                                        <el-icon>
                                            <QuestionFilled />
                                        </el-icon>
                                    </span>
                                </template>
                                <ul style="height: 300px; overflow: auto;">
                                    <span style="font-size: 18px; font-weight: bold;">文件来源地址</span>
                                    <li
                                        v-for="(item,index) in resultValue.originPathSource"
                                        :key="index"
                                    >{{ item }}</li>
                                </ul>
                            </el-popover>
                        </template>
                        {{ resultValue.resultSize }}
                    </el-descriptions-item>
                    <el-descriptions-item
                        label="时间范围"
                    >{{ resultValue.startTime }} —— {{ resultValue.endTime }}</el-descriptions-item>
                    <el-descriptions-item label="git仓库地址">{{resultValue.repoPath}}</el-descriptions-item>
                    <el-descriptions-item label="生成文件地址">{{ resultValue.outputPath }}</el-descriptions-item>
                    <el-descriptions-item label="操作（若无文件请查看点击【文件数量】查看文件来源地址是否正确）">
                        <el-button type="success" @click="openFile">查看文件</el-button>
                    </el-descriptions-item>
                </el-descriptions>
            </div>
        </div>
    </div>
</template>

<script setup>
import { onMounted, ref } from 'vue'
import moment from 'moment'
import { ipc } from '@/utils/ipcRenderer'
import { ipcApiRoute } from '@/api/main.js'
import { ElLoading, ElMessage } from 'element-plus'

const searchForm = ref({
    username: "",
    startTime: moment().format('YYYY-MM-DD HH:mm:ss'),
    endTime: moment().format('YYYY-MM-DD HH:mm:ss'),
    repoPath: ""
})
onMounted(() => {
    getUserName()
})
const getUserName = () => {
    ipc.invoke(ipcApiRoute.getGitUsername, {}).then(res => {
        if (res) {
            searchForm.value.username = res
        }
    })
}
const resultValue = ref({
    resultSize: 0,
    username: '',
    startTime: '？',
    endTime: '？',
    outputPath: '/',
    repoPath: '/',
    originPathSource: []
})
const onSubmit = () => {
    if (!searchForm.value.startTime) {
        ElMessage.warning('请输入开始时间')
        return false
    }
    if (!searchForm.value.repoPath) {
        ElMessage.warning('请输入文件目录地址')
        return false
    }
    const loading = ElLoading.service({
        lock: true,
        text: '文件提取中...',
        background: 'rgba(0, 0, 0, 0.7)',
    })
    ipc.invoke(ipcApiRoute.getGitFiles, {
        username: searchForm.value.username,
        startTime: searchForm.value.startTime,
        endTime: searchForm.value.endTime,
        repoPath: searchForm.value.repoPath
    }).then(res => {
        if (res && res.successful) {
            console.log(res)
            resultValue.value.resultSize = res.resultSize
            resultValue.value.username = res.username
            resultValue.value.startTime = res.startTime
            resultValue.value.endTime = res.endTime
            resultValue.value.outputPath = res.outputPath
            resultValue.value.repoPath = res.repoPath
            resultValue.value.originPathSource = res.originPathSource
        }
        loading.close()
    })
}
const openFile = () => {
    if (resultValue.value.outputPath) {
        ipc.invoke(ipcApiRoute.openDirectory, { path: resultValue.value.outputPath }).then(res => { })
    } else {
        ElMessage.warning('文件目录地址不存在')
    }
}
</script>

<style lang="less" scoped>
.container {
    height: 95vh;
    width: 98%;
    display: flex;
    justify-content: space-between;
    background-color: #dde3e9;
    margin-top: 10px;
    padding: 10px;
    .content {
        height: 100%;
        background-color: #fff;
        width: 100%;
        border-radius: 8px;
        padding: 10px;
        box-sizing: border-box;
        .info {
            height: calc(100% - 50px);
            overflow: auto;
        }
    }
}
</style>